import React, { Component } from 'react';
import { Button } from 'antd';
import styles from '../../../index.less';

class TabBusinessComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      disabled: props.disabled,
      data: [{
        sName: '材料库存',
        value: '(材料名称,材料规格,仓库名称,自定义项)',
      }, {
        sName: '成品库存',
        value: '(成品名称,仓库名称,自定义项)',
      }, {
        sName: '材料成本价',
        value: '(材料名称)',
      }],
    };
  }

  componentWillReceiveProps(nextProps) {
    this.setState({ disabled: nextProps.disabled });
  }

  handleDoubleClick = (e, child) => {
    this.props.onChangeFormnula(child.value);
  }

  render() {
    const { data, disabled } = this.state;
    return (
      <div className={styles.tabButton}>
        {
          data.map(child => (
            <Button
              key={child.value}
              disabled={disabled}
              onDoubleClick={e => this.handleDoubleClick(e, child)}
            >
              {child.sName}
            </Button>
          ))
        }
      </div>
    );
  }
}

export default TabBusinessComponent;
